<script type="text/javascript">
//<![CDATA[
var GRonline = '';

function update() {
    var docObj = window.frames['GR_preview'].document;
    var textarea = document.getElementById('GR_editHere');

    if (GRonline != textarea.value) {
        GRonline = textarea.value
        docObj.open('text/html', 'replace');
        docObj.write(GRonline);
        docObj.close();
    }
    window.setTimeout(update, 150)
}
onload = function () {
    document.getElementById('GR_htmlEditor').style.display = 'inline';
    //document.getElementById('GR_editHere').select();
    update();
}
//]]>
</script>

<style type="text/css">
.GR_Editor{margin:0 auto;background:#888;padding:10px 0;min-height:700px;position:relative;}.GR_Editor h2,.GR_Editor h3{font:bold 40px "Times New Roman",Times,serif;text-align:center;margin:0;padding:0;}.GR_Editor h2 a:link,.GR_Editor h3{color:#ccc;text-decoration:none;display:block;text-shadow:-1px -1px 0 #fff,1px 1px 0 #555;}.GR_Editor h2 a:hover{color:#f00;}.GR_Editor h3{font:bold 22px Georgia,"Times New Roman",Times,serif;margin:10px 0 5px;}#GR_editHere,#GR_preview{width:auto;width:100%;display:block;margin:0;}#GR_editHere{width:70%;min-width:400px;margin:0 auto;background:#ccc;padding:10px 5px 5px 12px;font:normal 12px Verdana,Tahoma,Arial;line-height:18px;border:2px solid #444;border-radius:8px;box-shadow:0 0 8px #fff;}#div_GR_preview{background:#fff;border:2px solid #aaa;height:auto;min-height:580px;max-width:100%;overflow:auto;resize:both;padding:0;margin:0;}#GR_preview{min-height:560px;width:100%;border:none;}.meongku{width:200px;margin:0 auto;}.meongku .clik{cursor:pointer;}a{outline:none !important;}
.post .post-body:after{display:none;}
</style>

<div id="GR_htmlEditor" style="display: none">
<div class="GR_Editor">
<h2><a href="http://gubhugreyot.blogspot.com" target="_blank">HTML Editor Online</a></h2>
<form>
<div class="meongku"><input class="clik" onclick="javascript:this.form.GR_editHere.focus();this.form.GR_editHere.select();" value="Select All" type="button"/><input class="clik" onclick="javascript:this.form.GR_editHere.value='';" value="Clear" type="button"/> </div>
<textarea name="ta" id="GR_editHere" rows="10">
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Online HTML Editor</title>

<style type="text/css">
.meong{
       padding:10px;
       background:lightblue;
       margin:10px 0;
       font-size:50px;
       letter-spacing:-1px;
}
.meong img{
       vertical-align:middle;
       margin-right:20px;
}
</style>

</head>

<body>

<p class="meong"><a href="http://gubhugcss.blogspot.com" target="_blank" title="Ciluk....., baaaaa....!!!!!"><img src="https://lh6.googleusercontent.com/-QYGyo4MaOD4/UDAZ-88GC7I/AAAAAAAAAMw/IP-xTZN5NFg/s120/gambar-kucing-300x300.jpg" width="120" height="120" alt="Kucing garong" /></a>Kucing Garong</p>

</body>
</html>
</textarea>
</form>
 <h3>Preview</h3>
    <div id="div_GR_preview"> 
 <iframe src="javascript:''" name="GR_preview" id="GR_preview">
  <p> Sorry, your browser does not support the Real Time HTML editor. We recommend you upgrade your browser.</p>
 </iframe>
    </div> 
</div>
</div>